<template>
	<view class="" style="width: 100vw;height: 100vh">
			<view 
		style="min-height: 100vh"> 
		<hx-navbar title="抽奖记录" :back="true" :fixed="false" :color="knavTitleColor" barPlaceholder="hidden" transparent="auto"></hx-navbar>
		<view class="container">
			<view class="item cell-item-cb" v-for="(item,index) in list" :key="index">
				<view class="">
					<view class="color-0 fsz28 font-blod" v-if="item.status==1">{{item.status==1?'恭喜您中奖了':'很遗憾，未中奖！'}}</view>
					<view class="color-0 fsz22 m-t-10">{{item.ctime}}</view>
				</view>
				<view class="color-o fsz32 font-blod" v-if="item.status==1">
					{{item.remake}}
				</view>
			</view>
	<view style="text-align: center;" v-if="list.length == 0">
						 <image src="@/static/without.png" style="width:550rpx;margin: 10rpx auto " alt="" mode="widthFix"></image> 
					<!-- 	<image src="/static/user/none_img2.png" mode="widthFix"></image> -->
					</view>	</view>
	
	</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [],
				hasNextPage: true,
				page: 1,
				limit: 10
			}
		},
		onLoad() {
			this.get_record()
		},
		onPullDownRefresh() {
					setTimeout(function() {
						uni.stopPullDownRefresh()
					}, 200)
				this.get_record()
				},
		onReachBottom() {
			if (this.hasNextPage) {
				let new_page = this.page + 1;
				let data = {
					page: new_page,
					limit: this.limit
				}
				this.$api.record(data, res => {
					if (res.status) {
						this.list = this.list.concat(res.data);
						this.hasNextPage = res.data.length >= this.limit;
						this.page = new_page
					}
				})
			}
		},
		methods: {

			get_record() {
				let data = {
					page: this.page,
					limit: this.limit
				}
				this.$api.record(data, res => {
					if (res.status) {
						this.list = res.data
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		padding: 30rpx 40rpx;
		.item {
			background-color: $bg-box;
			border-radius: 20rpx;
			padding: 38rpx 30rpx;
			border: 1px solid #DCDCDC;
			margin-bottom: 20rpx;
		}
	}
</style>